<!-- 商家中心 -->
<template>
    <view class="merchant-wrap">
        <view class="shopinfo-box" :style="'background: url(' + imgUrl + '/img/static/shop/shop_bg.png)'">
            <!-- 商家信息 -->
            <view class="user-head flex justify-between">
                <view class="shop-info">
                    <view class="flex margin-right-xs">
                        <text class="shop-title margin-right-sm">{{ storeDetail.shopname }}</text>
                        <text class="iconfont icon-xiala"></text>
                    </view>
                    <view class="shop-address line2" @tap="jump('/pages/app/merchant/info')">
                        {{ storeDetail.city || "" }}
                    </view>

                    <view class="heXiao" @click="getCode">
                        <image :src="imgUrl + 'img/static/shop/skm.png'" mode="widthFix" />
                    </view>
                </view>
            </view>
        </view>
        <!-- 核销卡片 -->
        <view class="info-card-box flex justify-between">
            <view class="info-card">
                <image class="card-bg" :src="imgUrl + '/img/static/shop/smhx.png'" mode="aspectFill"> </image>
                <view class="card-content flex-col" @click="$refs.popups.open()">
                    <view class="card-title">输码核销</view>
                    <view class="flex card-detail-box">
                        <text class="wlIcon-xiugaioryijian margin-right-xs icon-color1"></text>
                        <text class="icon-color1 u-m-l-20">输码</text>
                    </view>
                </view>
            </view>
            <view class="info-card" @tap="getScanCode">
                <image class="card-bg" :src="imgUrl + '/img/static/shop/smhx2.png'" mode="aspectFill"> </image>
                <view class="card-content flex-col">
                    <view class="card-title">扫码核销</view>
                    <view class="flex card-detail-box">
                        <text class="wlIcon-saoyisao margin-right-xs icon-color2"></text>
                        <text class="icon-color2 u-m-l-20">扫码</text>
                    </view>
                </view>
            </view>
        </view>

        <view class="cancel-shop-box">
            <!-- 筛选框 -->
            <view class="cancel-nav" style="width: 100vw">
                <uv-drop-down
                    ref="dropDown"
                    sign="dropDown_1"
                    text-active-color="#3c9cff"
                    :extra-icon="{ name: 'arrow-down-fill', color: '#666', size: '26rpx' }"
                    :extra-active-icon="{ name: 'arrow-up-fill', color: '#3c9cff', size: '26rpx' }"
                    :defaultValue="defaultValue"
                    :custom-style="{ padding: '0 30rpx' }"
                    @click="selectMenu"
                >
                    <uv-drop-down-item
                        name="order"
                        type="2"
                        :label="dropItem('order').label"
                        :value="dropItem('order').value"
                    >
                    </uv-drop-down-item>
                    <uv-drop-down-item name="sp" type="2" :label="dropItem('sp').label" :value="dropItem('sp').value">
                    </uv-drop-down-item>
                    <uv-drop-down-item
                        name="type"
                        type="2"
                        :label="dropItem('type').label"
                        :value="dropItem('type').value"
                    >
                    </uv-drop-down-item>
                </uv-drop-down>
                <uv-drop-down-popup
                    sign="dropDown_1"
                    :click-overlay-on-close="true"
                    :currentDropItem="currentDropItem"
                    @clickItem="clickItem"
                    @popupChange="change"
                ></uv-drop-down-popup>
            </view>
            <!-- 销量 -->
            <view class="sales-volume-box flex justify-around u-p-30">
                <view
                    class="sales-volume u-row-center u-col-center"
                    style="width: 40%; text-align: center; line-height: 70rpx"
                    >订单量(单)：{{ count || 0 }}</view
                >
                <view
                    class="sales-volume u-row-center u-col-center"
                    style="width: 40%; text-align: center; line-height: 70rpx"
                    >交易额(元)：{{ sum }}</view
                >
            </view>
        </view>

        <!-- 订单列表 -->
        <view
            class="order-list"
            v-for="order in storeOrderList"
            :key="order.order_sn"
            @tap="jump('/pages/app/merchant/detail', { orderId: order.id })"
        >
            <block v-if="order.ordergoods">
                <block v-for="item in order.ordergoods">
                    <view class="order-head flex justify-between">
                        <text class="no">订单编号：{{ order.order_no }}</text>
                        <text class="state">{{ order.use_status == 0 ? "待自提" : "已提货" }}</text>
                    </view>
                    <view class="goods-order">
                        <view class="order-item">
                            <view class="order-img">
                                <image :src="imgUrl + item.image" mode="aspectFill"></image>
                            </view>
                            <view class="order-info">
                                <view class="order-title u-ellipsis-1">{{ item.title }}</view>
                                <view style="height: 60rpx"></view>
                                <view class="order-sku u-ellipsis-1">
                                    <text> ￥{{ item.price }}</text>
                                    <text class="order-num">数量：{{ item.number || 0 }}</text>
                                </view>
                            </view>
                        </view>
                    </view>
                </block>
            </block>
            <block v-else>
                <view class="order-head flex justify-between">
                    <text class="no">订单编号：{{ order.order_sn || order.coupon_no }}</text>
                    <text class="state">{{ order.use_status == 0 ? "待自提" : "已提货" }}</text>
                </view>
                <view class="goods-order">
                    <view class="order-item">
                        <view class="order-img">
                            <image :src="order.goods_image" mode="aspectFill"></image>
                        </view>
                        <view class="order-info">
                            <view class="order-title u-ellipsis-1">{{ order.goods_name || order.name }}</view>
                            <view style="height: 60rpx"></view>
                            <view class="order-sku u-ellipsis-1">
                                <text class="wlIcon-jifen1"></text>
                                <text> {{ order.score }}{{ order.goods_type == 2 ? "+ ￥" + order.money : "" }} </text>
                                <text class="order-num">数量：{{ order.goods_num || 0 }}</text>
                            </view>
                        </view>
                    </view>
                </view>
            </block>
        </view>

        <!-- 输码弹窗 -->
        <uni-popup ref="popup" type="center" @change="change" background-color="#fff">
            <view class="modal-box flex-col u-col-center" style="padding-bottom: 1rpx">
                <view class="modal-head flex-col u-col-center">
                    <image
                        class="modal-head-img"
                        :src="'http://file.shopro.top' + '/imgs/modal/store_check.png'"
                        mode=""
                    ></image>
                    <text class="modal-head-title">输码核销</text>
                </view>
                <input
                    class="inp"
                    type="number"
                    v-model="qrcode"
                    placeholder="在此输入核销码"
                    placeholder-class="pl-inp"
                />
                <button class="u-reset-button post-btn" @tap="onConfirm">核销</button>
            </view>
        </uni-popup>

        <!-- 底部选择弹窗 -->
        <uni-popup ref="popups" type="bottom" @change="change">
            <view class="uni-popups" style="border-radius: 20rpx 20rpx 0 0; background-color: #fff">
                <view
                    class="uni-popups-item"
                    v-for="item in uvpopup"
                    :key="item.id"
                    :class="item.id == logo ? 'active' : 'none'"
                    @click="changeLogo(item)"
                    >{{ item.name }}</view
                >
            </view>
        </uni-popup>
        <!-- 日期选择 -->
        <uv-calendar ref="calendar" mode="range" @change="selDate" @close="close"> </uv-calendar>
        <uni-popup ref="popupCode" type="center" round="10" @change="change">
            <view style="text-align: center; padding: 20rpx 40rpx; background-color: #fff; border-radius: 20rpx">
                <view style="font-size: 36rpx; font-weight: 600; padding-top: 10rpx">扫码支付</view>
                <image
                    @click="delImg(storeDetail.code_image)"
                    :src="storeDetail.code_image"
                    style="width: 400rpx; padding: 20rpx"
                    mode="widthFix"
                />
                <view>长按保存</view>
            </view>
        </uni-popup>
    </view>
</template>

<script>
// import { mapMutations, mapActions, mapState } from "vuex";
// import Auth from "@/shopro/permission/index.js";
import wx from "weixin-js-sdk";
export default {
    data() {
        return {
            imgUrl: this.$imgUrl,

            uvpopup: [
                {
                    name: "积分订单",
                    id: 1,
                    type: 1,
                },
                {
                    name: "优惠券",
                    id: 3,
                    type: 3,
                },
                {
                    name: "商城订单",
                    id: 2,
                    type: 2,
                },
            ],
            logo: 0,
            // 筛选
            custom: [], //自定义日期

            storeOrderList: [], //订单商品列表
            orderInfo: {}, //订单统计信息
            storeDetail: {}, //门店信息
            qrcode: "", //输码

            loadStatus: "loadmore", //loadmore-加载前的状态，loading-加载中的状态，nomore-没有更多的状态
            currentPage: 1,
            lastPage: 1,
            // 表示value等于这些值，就属于默认值
            defaultValue: [0, "all"],
            // 筛选结果
            result: [
                {
                    name: "order",
                    label: "最新发布",
                    value: "new",
                },
            ],
            activeName: "order",
            order: {
                label: "今日",
                value: "all",
                activeIndex: 0,
                color: "#333",
                activeColor: "#2878ff",
                child: [
                    {
                        label: "今日",
                        value: "0",
                        parmas: "today",
                    },
                    {
                        label: "昨天",
                        value: "1",
                        parmas: "yesterday",
                    },
                    {
                        label: "本周",
                        value: "2",
                        parmas: "week",
                    },
                    {
                        label: "本月",
                        value: "3",
                        parmas: "month",
                    },
                    {
                        label: "自定义",
                        value: "4",
                        parmas: "custom",
                    },
                ],
            },
            sp: {
                label: "商品",
                value: "shop",
                activeIndex: 0,
                color: "#333",
                activeColor: "#2878ff",
                child: [
                    {
                        label: "商品",
                        value: 0,
                        parmas: "shop",
                    },
                    {
                        label: "积分",
                        value: 1,
                        parmas: "score",
                    },
                    {
                        label: "优惠券",
                        value: 2,
                        parmas: "coupon",
                    },
                ],
            },
            type: {
                label: "全部",
                value: "all",
                activeIndex: 0,
                color: "#333",
                activeColor: "#2878ff",
                child: [
                    {
                        label: "全部",
                        value: 0,
                        parmas: "all",
                    },
                    {
                        label: "待核销",
                        value: 1,
                        parmas: "nosend",
                    },
                    {
                        label: "已核销",
                        value: 2,
                        parmas: "noget",
                    },
                ],
            },
            bianLiang: "shop", //shop商品score积分coupon优惠券
            time: "",
            scoreStatus: 0, // 0全部 1已核销 2未核销
            count: 0, //今日订单能量
            sum: 0, //交易额
        };
    },
    onPageScroll() {
        // 滚动后及时更新位置
        this.$refs.dropDown.init();
    },
    computed: {
        dropItem(name) {
            return (name) => {
                const result = {};
                const find = this.result.find((item) => item.name === name);
                if (find) {
                    result.label = find.label;
                    result.value = find.value;
                } else {
                    result.label = this[name].label;
                    result.value = this[name].value;
                }
                return result;
            };
        },
        // 获取当前下拉筛选项
        currentDropItem() {
            return this[this.activeName];
        },
    },
    onLoad(options) {
        options && options.storeId && uni.setStorageSync("storeId", options.storeId);
        this.getStoreDetail();
        this.bianLiang == "shop"; //0商品1积分
        this.currentPage = 1;
        this.lastPage = 1;
        this.storeOrderList = [];
        this.getShopOrder();
        this.injectConfig();
    },
    onShow() {},
    onPullDownRefresh() {
        this.currentPage = 1;
        this.lastPage = 1;
        this.storeOrderList = [];
        if (this.bianLiang == "shop") {
            this.getShopOrder();
        } else if (this.bianLiang == "score") {
            this.getStoreOrder();
        }
    },
    onReachBottom() {
        if (this.currentPage < this.lastPage) {
            this.currentPage += 1;
            if (this.bianLiang == "shop") {
                this.getShopOrder();
            } else if (this.bianLiang == "score") {
                this.getStoreOrder();
            }
        }
    },
    methods: {
        injectConfig() {
            let url = "";
            url = window.location.href.split("#")[0];
            uni.request({
                url: "/wanlshop/wechat/config ",
                method: "POST",
                data: {
                    url: url,
                },
                success: (response) => {
                    // const { data } = response;
                    // if (data) {
                    wx.config({
                        debug: response.res.data.debug, // 开启调试模式,
                        appId: response.res.data.appId, // 必填，企业号的唯一标识
                        timestamp: response.res.data.timestamp, // 必填，生成签名的时间戳
                        nonceStr: response.res.data.nonceStr, // 必填，生成签名的随机串
                        signature: response.res.data.signature, // 必填，签名
                        jsApiList: ["scanQRCode"], // 必填，需要使用的JS接口列表
                    });
                    wx.ready(() => {
                        console.log("成功");
                    });
                    wx.error(function (res) {
                        console.log("出错了：" + res.errMsg); //wx.config配置错误，会弹出窗口哪里错误，然后根据微信文档查询即可。
                    });
                },
            });
        },
        //二维码弹窗
        getCode() {
            this.$refs.popupCode.open("center");
        },

        //
        changeLogo(e) {
            this.logo = e.id; //1积分2商城3优惠券
            this.$refs.popups.close(); //关闭弹出层--选择核销对象
            this.$refs.popup.open();
        },
        change(e) {},
        /*** 点击每个筛选项回调 */
        selectMenu(e) {
            const { name, active, type } = e;
            this.activeName = name;

            const find = this.result.find((item) => item.name == this.activeName);
            if (find) {
                const findIndex = this[this.activeName].child.findIndex(
                    (item) => item.label == find.label && item.value == find.value
                );
                this[this.activeName].activeIndex = findIndex;
            } else {
                this[this.activeName].activeIndex = 0;
            }
        },
        /*** 点击菜单回调处理 */
        clickItem(e) {
            // 下面有重新赋值，所以用let
            let { label, value } = e;
            const findIndex = this.result.findIndex((item) => item.name == this.activeName);
            if (this.defaultValue.indexOf(value) > -1 && this[this.activeName].label) {
                label = this[this.activeName].label;
            }
            // 已经存在筛选项
            if (findIndex > -1) {
                this.$set(this.result, findIndex, {
                    name: this.activeName,
                    label,
                    value,
                });
            } else {
                this.result.push({
                    name: this.activeName,
                    label,
                    value,
                });
            }
            this.result = this.result.filter((item) => this.defaultValue.indexOf(item.value) == -1);
            this.currentPage = 1;
            this.lastPage = 1;
            this.storeOrderList = [];
            if (e.parmas == "score") {
                this.bianLiang = "score";
                this.getStoreOrder();
            } else if (e.parmas == "shop") {
                this.bianLiang = "shop";
                this.getShopOrder();
            } else if (e.parmas == "custom") {
                this.time = e.parmas;
                this.$refs.calendar.open();
            } else if (e.parmas == "today" || e.parmas == "yesterday" || e.parmas == "week" || e.parmas == "month") {
                this.time = e.parmas;
                this.custom_time = "";
                this.onFilter();
            } else if (e.parmas == "all" || e.parmas == "nosend" || e.parmas == "noget") {
                this.scoreStatus = e.value;
                if (this.bianLiang == "shop") {
                    this.getShopOrder();
                } else if (this.bianLiang == "score") {
                    this.getStoreOrder();
                }
            } else if (e.parmas == "coupon") {
                this.getCouponOrder();
            }
        },
        jump(path, query) {
            uni.navigateTo({
                path: path,
                query: query,
            });
        },

        /*** 累加某字段值*/
        // reduceAdd(list, key) {
        //     return list.reduce((pre, cur) => (pre += Number(cur[key])), 0);
        // },

        // 获取门店信息
        getStoreDetail() {
            let that = this;
            uni.request({
                url: "/shop.shop/GetShopDetail ",
                data: {},
                method: "POST",
                success: (res) => {
                    that.storeDetail = res.res.data;
                },
                fail: (error) => {},
            });
        },

        // 扫码
        async getScanCode() {
            // #ifdef H5
            this.injectConfig();
            wx.ready(function () {
                // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
                wx.checkJsApi({
                    jsApiList: ["scanQRCode"], // 需要检测的JS接口列表，所有JS接口列表见附录2,
                    success: function (res) {},
                });
                wx.scanQRCode({
                    needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
                    scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有
                    success: function (res) {
                        // 当needResult 为 1 时，扫码返回的结果
                        // 扫码之后的逻辑处理
                        uni.request({
                            url: "/shop.shop/CheckOrder",
                            data: {
                                code: res.resultStr,
                                // store_id: uni.getStorageSync("storeId"),
                            },
                            complete: (res) => {
                                uni.showToast({
                                    title: res.res.msg,
                                    icon: "none",
                                    mask: true,
                                });
                                this.time = "";
                                this.filter1Label = "";
                                this.scoreStatus = "";
                                this.qrcode = "";
                                this.storeOrderList = [];
                                this.$refs.popup.close();
                                this.currentPage = 1;
                                this.lastPage = 1;
                                this.storeOrderList = [];
                                if (res.res.code == 1) {
                                    if (this.logo == 1) {
                                        that.getStoreOrder();
                                    } else if (this.logo == 2) {
                                        that.getShopOrder();
                                    } else {
                                        console.log("ypouhuiquan ");
                                    }
                                }

                                this.logo = 0;
                            },
                        });
                    },
                });
            });
            // #endif
            // #ifdef MP
            uni.scanCode({
                scanType: ["qrCode"],
                success: (res) => {
                    console.log(res);
                    if (res.result) {
                        this.postOrderConfirm(res.result);
                    } else {
                        console.log("请重新扫描");
                        return false;
                    }
                },
                fail: (res) => {
                    console.log("未识别到二维码");
                },
            });
            // #endif
        },

        // 输码
        onConfirm() {
            if (this.logo == 1) {
                this.qrcode = "score:" + this.qrcode;
            } else if (this.logo == 2) {
                this.qrcode = "order:" + this.qrcode;
            } else if (this.logo == 3) {
                this.qrcode = "coupon:" + this.qrcode;
            }
            this.postOrderConfirm(this.qrcode);
        },
        // 核销
        postOrderConfirm(code) {
            // let that = this;
            uni.request({
                url: "/shop.shop/CheckOrder",
                data: {
                    code: code,
                    // store_id: uni.getStorageSync("storeId"),
                },
                complete: (res) => {
                    console.log(res, "hexiaowacheng ");
                    this.qrcode = "";
                    this.storeOrderList = [];
                    uni.showToast({
                        title: res.res.msg,
                        icon: "none",
                        mask: true,
                    });
                    this.$refs.popup.close();
                    this.currentPage = 1;
                    this.lastPage = 1;
                    this.storeOrderList = [];
                    if (res.res.code == 1) {
                        if (this.logo == 1) {
                            that.getStoreOrder();
                        } else if (this.logo == 2) {
                            that.getShopOrder();
                        } else if (this.logo == 3) {
                            console.log("youuhiquan ");
                        }
                    }

                    this.logo = 0;
                },
            });
        },
        // 订单列表--商城
        getShopOrder() {
            let that = this;
            that.loadStatus = "loading";
            uni.request({
                url: "/shop.shop/GetCheckList",
                method: "POST",
                data: {
                    time: this.time,
                    custom_time: this.filter1Label,
                    status: this.scoreStatus,
                },
                success: (res) => {
                    console.log(res);
                    if (that.storeOrderList == undefined) {
                        that.storeOrderList = res.res.data.list.data;
                    } else {
                        that.storeOrderList = [...that.storeOrderList, ...res.res.data.list.data];
                    }
                    that.count = res.res.data.count; //今日订单量
                    that.sum = res.res.data.sum; //交易额
                    that.orderInfo = res.res.data.list.data;
                    that.lastPage = res.res.data.list.last_page;
                    that.loadStatus = that.currentPage < res.res.data.list.last_page ? "loadmore" : "nomore";
                },
            });
        },

        // 订单列表--积分
        getStoreOrder() {
            let that = this;
            that.loadStatus = "loading";
            uni.request({
                url: "/shop.score/GetCheckList",
                method: "POST",
                data: {
                    time: this.time,
                    custom_time: this.filter1Label,
                    status: this.scoreStatus,
                },
                success: (res) => {
                    uni.stopPullDownRefresh();
                    // if (res.code == 1) {

                    if (that.storeOrderList == undefined) {
                        that.storeOrderList = res.res.data.list.data;
                    } else {
                        that.storeOrderList = [...that.storeOrderList, ...res.res.data.list.data];
                    }
                    that.count = res.res.data.count; //今日订单量
                    that.sum = res.res.data.sum; //交易额
                    that.orderInfo = res.res.data.list.data;
                    that.lastPage = res.res.data.last_page;
                    that.loadStatus = that.currentPage < res.res.data.list.last_page ? "loadmore" : "nomore";
                },
            });
        },
        // 订单列表---优惠券
        getCouponOrder() {
            let that = this;
            that.loadStatus = "loading";
            uni.request({
                url: "/shop.coupon/GetCouponOrderList",
                method: "POST",
                data: {
                    time: this.time,
                    custom_time: this.filter1Label,
                    status: this.scoreStatus,
                },
                success: (res) => {
                    uni.stopPullDownRefresh();
                    // if (res.code == 1) {
                    if (that.storeOrderList == undefined) {
                        that.storeOrderList = res.res.data.data;
                    } else {
                        that.storeOrderList = [...that.storeOrderList, ...res.res.data.data];
                    }
                    console.log(res.res.data, that.storeOrderList, "[[[[]]]]");
                    that.count = res.res.data.count; //今日订单量
                    that.sum = res.res.data.sum; //交易额
                    that.orderInfo = res.res.data.data;
                    that.lastPage = res.res.data.last_page;
                    that.loadStatus = that.currentPage < res.res.data.last_page ? "loadmore" : "nomore";
                },
            });
        },
        // 选择日期
        selDate(e) {
            this.custom = [];
            this.custom.push(e.startDate);
            this.custom.push(e.endDate);
            this.isShowDropDown = false;
            this.filter1Label = `${e.selected[0]} - ${e.selected[e.selected.length - 1]}`;
            console.log(this.filter1Label);
        },
        // 关闭日期选择
        close() {
            this.onFilter();
        },
        // 选择筛选
        onFilter(val, title) {
            this.storeOrderList = [];
            this.currentPage = 1;
            this.lastPage = 1;
            this.storeOrderList = [];
            if (this.bianLiang == "shop") {
                this.getShopOrder();
            } else if (this.bianLiang == "score") {
                this.getStoreOrder();
            }
        },
        //长安保存图片
        delImg(images) {
            let that = this;
            uni.showModal({
                title: "提示",
                content: "是否确认下载",
                success: function (res) {
                    if (res.confirm) {
                        uni.downloadFile({
                            url: images,
                            success: function (res) {
                                if (res.statusCode === 200) {
                                    // 下载成功后将临时文件保存到相册
                                    uni.saveImageToPhotosAlbum({
                                        filePath: res.tempFilePath,
                                        success: function () {
                                            uni.showToast({
                                                title: "保存成功",
                                                icon: "none",
                                            });
                                        },
                                        fail: function (err) {
                                            uni.showToast({
                                                title: "保存失败",
                                                icon: "none",
                                            });
                                        },
                                    });
                                } else {
                                    uni.showToast({
                                        title: "下载失败",
                                        icon: "none",
                                    });
                                }
                            },
                            fail: function (err) {
                                uni.showToast({
                                    title: "下载失败: ",
                                    icon: "none",
                                });
                            },
                        });
                    } else if (res.cancel) {
                        console.log("用户点击取消");
                    }
                },
            });
        },
    },
};
</script>

<style lang="scss">
.heXiao {
    width: 100rpx;
    height: 100rpx;
    position: absolute;
    right: 60rpx;
    padding: 10rpx 20rpx;
    // background-color: #fff;
    border-radius: 30rpx;
}

//旧的
/deep/.modal-head-title {
    display: flex;
    justify-content: center;
}

// 遮罩
.mask {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 20;
}

// 商户信息
.shopinfo-box {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 320rpx;

    .user-head {
        padding-top: 10rpx;

        .shop-info {
            padding-left: 30rpx;

            .shop-title {
                font-size: 34rpx;
                font-weight: bold;
                color: rgba(255, 255, 255, 1);
            }

            .icon-xiala {
                font-size: 34rpx;
                color: rgba(255, 255, 255, 1);
            }

            .shop-address {
                font-size: 28rpx;
                font-weight: 500;
                color: rgba(255, 255, 255, 1);
                width: 540rpx;
            }
        }

        .merchant-btn {
            padding: 0;
            width: 136rpx;
            line-height: 46rpx;
            background: rgba(255, 255, 255, 1);
            border-radius: 23rpx 0px 0px 23rpx;
            font-size: 20rpx;

            font-weight: 500;
            color: #3eb49c;
        }
    }
}

// 卡片
.info-card-box {
    background-color: #fff;
    padding: 30rpx 20rpx;

    .info-card {
        position: relative;
        width: 350rpx;
        height: 165rpx;
        border-radius: 10rpx;
        overflow: hidden;

        .card-bg {
            width: 100%;
            height: 100%;
        }

        .card-content {
            position: absolute;
            width: 100%;
            height: 100%;
            z-index: 3;
            top: 0;
            left: 0;
            padding: 30rpx 0 0 30rpx;

            .card-title {
                font-size: 28rpx;

                font-weight: bold;
                color: rgba(255, 255, 255, 1);
            }

            .card-detail-box {
                padding: 10rpx 20rpx;
                height: 45rpx;
                background: rgba(255, 255, 255, 1);
                width: 150rpx;
                border-radius: 23rpx;
                margin-top: 20rpx;

                .card-detail {
                    font-size: 22rpx;

                    font-weight: 500;
                }

                .icon-color1 {
                    color: #00b6ce;
                    font-size: 24rpx;
                }

                .icon-color2 {
                    color: #0f98f9;
                    font-size: 24rpx;
                }
            }
        }
    }
}

// 核销nav
.cancel-nav {
    background: #fff;
    margin: 10rpx 0 0;
    position: relative;
    z-index: 22;
    padding: 0 20rpx;
}

// 销量
.sales-volume-box {
    background-color: #fff;

    .sales-volume {
        width: 338rpx;
        height: 72rpx;
        background: rgba(76, 184, 157, 0.06);
        border: 1rpx solid rgba(185, 227, 217, 1);
        border-radius: 10rpx;
        font-size: 24rpx;
        font-weight: 400;
        color: rgba(76, 184, 157, 1);
    }
}

// 输码弹窗
.modal-box {
    background: #fff;
    width: 610rpx;
    margin: 0 auto;
    border-radius: 20rpx;

    .modal-head {
        width: 100%;

        .modal-head-img {
            width: 100%;
            height: 213rpx;
        }

        .modal-head-title {
            font-size: 35rpx;

            font-weight: bold;
            color: #343434;
            line-height: 42rpx;
        }
    }

    .inp {
        width: 501rpx;
        height: 78rpx;
        border: 1rpx solid #e5e5e5;
        margin: 60rpx auto 40rpx;
        font-size: 28rpx;

        font-weight: 400;
        color: #6d5028;
        padding-left: 20rpx;

        .pl-inp {
            color: #9a9a9a;
        }
    }

    .post-btn {
        width: 492rpx;
        line-height: 70rpx;
        background: linear-gradient(90deg, #2eae9c, #6cc29f);
        box-shadow: 0px 7rpx 6rpx 0px rgba(#6cc29f, 0.22);
        border-radius: 35rpx;
        font-size: 28rpx;

        font-weight: 500;
        color: rgba(255, 255, 255, 1);
        padding: 0;
        margin-bottom: 60rpx;
    }
}

// 订单列表
.order-list {
    background: #fff;
    margin: 20rpx 0;
    padding: 0 20rpx;

    .order-bottom {
        justify-content: flex-end;
        height: 80rpx;
        padding: 0 20rpx;

        .total-price-title {
            color: #999999;
            font-size: 24rpx;
        }

        .total-price {
            color: #333;
            font-size: 26rpx;

            &::before {
                content: "￥";
                font-size: 20rpx;
            }
        }
    }

    .order-head {
        padding: 0 25rpx;
        height: 77rpx;
        border-bottom: 1rpx solid #dfdfdf;

        .no {
            font-size: 26rpx;
            color: #999;
        }

        .state {
            font-size: 26rpx;
            color: #a8700d;
        }
    }

    .goods-order {
        border-bottom: 1px solid rgba(223, 223, 223, 0.5);
        padding: 20rpx;

        .order-item {
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 20rpx;
            width: 100%;

            .order-img {
                width: 160rpx;
                height: 160rpx;
                border-radius: 10rpx;
                margin-right: 20rpx;

                // background-color: #00b6ce;
                image {
                    width: 100%;
                    height: 100%;
                }
            }

            .order-info {
                width: calc(100% - 180rpx);

                .order-title {
                    font-size: 26rpx;
                    font-weight: 400;
                    color: rgba(51, 51, 51, 1);
                }

                .order-num {
                    font-size: 24rpx;
                    font-weight: 400;
                    color: rgba(153, 153, 153, 1);
                    float: right;
                }
            }
        }
    }
}

/deep/.uni-popups {
    width: 100vw;
    height: 300rpx;
    display: flex;
    justify-content: space-around;
    align-items: center;

    /deep/.uni-popups-item {
        height: 100rpx;
        width: 500rpx;
        border: 1rpx solid #000;
        text-align: center;
        line-height: 100rpx;
    }

    .active {
        background-color: #00b6ce;
        padding: 20rpx 40rpx;
        color: #fff;
    }
}
</style>
